/**
 * handle controller manager page logic.
 */
var __controllerId = null;

var __port_lv = '<ul data-role="listview" data-inset="true" class="lvPort">'
+ '<li data-role="list-divider">'
+ '<div data-role="controlgroup" data-type="horizontal" style="float: left;">'
+ '<h3 id="portIndex">Port index:</h3>'
+ '</div>'
+ '<div data-role="controlgroup" data-type="horizontal" data-mini="true" style="float: right;">'
+ '<a href="#" id="port" class="ui-btn ui-corner-all ui-icon-edit ui-btn-icon-notext">Icon only</a>'
+ '</div></li>'
+ '<li style="padding-top: 0; padding-bottom: 0;">'
+ '<div data-role="fieldcontain" data-type="horizontal">'
+ '<label for="textinput-type">Type:</label> <input type="text" name="textinput-type" id="textinput-type" placeholder="Type" value="" readonly>'
+ '</div></li>'
+ '<li style="padding-top: 0; padding-bottom: 0;">'
+ '<div data-role="fieldcontain" data-type="horizontal">'
+ '<label for="textinput-apptype">AppType:</label> <input type="text" name="textinput-apptype" id="textinput-apptype" placeholder="AppType" value="" readonly>'
+ '</div></li>'
+ '<li style="padding-top: 0; padding-bottom: 0;">'
+ '<div data-role="fieldcontain" data-type="horizontal">'
+ '<label for="textinput-name">Name:</label> <input type="text" name="textinput-name" id="textinput-name" placeholder="No name" value="" readonly>'
+ '</div></li>'
+ '<li style="padding-top: 0; padding-bottom: 0;">'
+ '<div data-role="fieldcontain" data-type="horizontal">'
+ '<label for="textinput-status">Status:</label> <input type="text" name="textinput-status" id="textinput-status" placeholder="No value" value="" readonly>'
+ '</div></li>'
+ '</ul>';

function clearPorts() {
	var rb = $('#rightBlock');
	rb.find('.lvPort').each(function(i, lv){
		lv.remove();
	});
}

function createPorts(ports) {
	clearPorts();
	var rb = $('#rightBlock');
	var length = ports.length;
	for(var x = 0; x < length; ++x) {
		var p = ports[x];
		var lv = $(__port_lv);
		lv.find('#portIndex').text("port index:" + p.index);
		lv.find('#textinput-type').val(p.type);
		lv.find('#textinput-apptype').val(p.appType);
		if (p.name) {
			lv.find('#textinput-name').val(p.name);
		}
		lv.find('#textinput-status').val(p.status);		
		rb.append(lv);
	}
	rb.trigger('create');
}

function onLoadController(controller) {
	$('#textinput-devid').val(controller.devId);
	$('#textinput-name').val(controller.name);
	$('#textinput-description').val(controller.description);
	$('#textinput-gwId').val(controller.gwId);
	$('#textinput-logintime').val(controller.logintime);
	
	createPorts(controller.ports);
}

function loadController(controllerId) {
    $.ajax({
        url : ('/loadController?cid='+controllerId),
        type : 'GET',
        dataType : 'json',
        success : function(result) {
            if (result.err) {
                showMsgPopup('load controller info failed:' + result.err);
            } else {
                onLoadController(result.controller);
            }
        },
        error : function(_, status, e) {
            showMsgPopup('load controller failed:' + e);
        }
    });
}

function pageinit() {
	$('#lvControllers').find('.controllerName').each(function(i, a) {
		var input = $(a).find("input").first();
		var controllerId = input.val();
		$(a).off('click').on('click', function(event) {
			__controllerId = controllerId;
			$("#controllerName").text("Controller: " + __controllerId);
			loadController(__controllerId);
			event.preventDefault();
		});
	});
}

$(document).on('pageinit', function() {
	pageinit();
});
